import React, { useState } from 'react';
import { List, Button } from 'antd';
import { useNavigate } from 'react-router-dom';

import { MERCH_DETAIL, ROLE_DETAIL, WORK_DETAIL } from '@/config/url';
import styles from './index.module.scss';

export default (props) => {
  const { item, className } = props;
  const navigate = useNavigate();

  const toDetail = () => {
    const routeMap = {
      goods: MERCH_DETAIL,
      charactar: ROLE_DETAIL,
      series: WORK_DETAIL
    };
    
    const route = routeMap[item.objectType];
    if (route) navigate(route + `?id=${item.objectId}`);
  };  

  return (
    <div className={`${styles['container']} ${className}`} onClick={toDetail}>
      <div className={styles['list-item']}>
        <div className={styles['thumb']}>
          <img src={item.objectMainImages ? `${item.objectMainImages}?x-oss-process=image/resize,p_40` : '/images/image-holder.svg'} alt={item.objectName} />
        </div>
        <div className={styles['meta']}>
          <div className={styles['title']}>{item.objectName}</div>
          <div className={styles['time']}>编辑时间：{item.objectTime}</div>
        </div>
      </div>
    </div>
  );
}